(function ($) {
    'use strict';

    $(function () {
        var carouselImg = [
            "./img/home_news/sy.jpg",
            "./img/home_news/lnz.jpg",
            "./img/home_news/wkd.png"
        ]

        $('#gimeItem').mouseenter(function () {
            $(this)[0].src = './img/home/gameCode.png'
        }).mouseleave(function () {
            $(this)[0].src = './img/home/gime.png'
        })
        $('#wxItem').mouseenter(function () {
            $(this)[0].src = './img/home/wxCode.jpg'
        }).mouseleave(function () {
            $(this)[0].src = './img/home/wx.png'
        })
        $('#downloadItem').mouseenter(function () {
            $(this)[0].src = './img/home/download.png'
        }).mouseleave(function () {
            $(this)[0].src = './img/home/logo9.png'
        })
        $('#kfItem').mouseenter(function () {
            $(this)[0].src = './img/home/kfcode.jpg'
        }).mouseleave(function () {
            $(this)[0].src = './img/home/kf.png'
        })





        /* 轮播效果 */
        var carousel_index = 1;
        var carousel_timer = null;

        function autoPlay() {
            carousel_timer = setInterval(function () {    /* 将定时器传给time变量 */
                carousel_index++;
                if (carousel_index >= 4) {
                    carousel_index = 1;
                }
                changeimg(carousel_index);  /* 初始化变量a 将set值传给changeimg方法 */
            }, 3000);
        }

        function changeimg(index) {
            $(".carousel-btn-box a").eq(index - 1).addClass("carousel-btn-selected").siblings().removeClass("carousel-btn-selected")
            $(".carousel-dots-box .carousel-dots").eq(index - 1).addClass("selected").siblings().removeClass("selected")
            $("#carousel-img").attr("src", carouselImg[index - 1])
        }

        autoPlay();

        $("#carousel-img").hover(function () { clearInterval(carousel_timer) }, function () { autoPlay() });
        $(".carousel-dots-box a").hover(function () { clearInterval(carousel_timer) }, function () { autoPlay() });
        $(".carousel-btn-box a").hover(function () { clearInterval(carousel_timer) }, function () { autoPlay() });

        $(".carousel-dots-box").on('click', 'a', function () {
            clearInterval(carousel_timer)
            var index = $(this).attr("data-index")
            carousel_index = index
            changeimg(carousel_index)
        })

        $(".carousel-btn-box").on('click', 'a', function () {
            clearInterval(carousel_timer)
            var index = $(this).attr("data-index")
            carousel_index = index
            changeimg(carousel_index)
        })


        /* 英雄介绍切换 */

        $(".rw-switch-avatar-wraper li").hover(function () {
            var rwIndex = $(this).attr("data-index")
            $(this).removeClass().addClass("selected").siblings().removeClass("selected")
            $(".rw-switch-name-wraper li").eq(rwIndex - 1).addClass("selected").siblings().removeClass("selected")
            switch (rwIndex) {
                case "1":
                    $("#hero").removeClass().addClass("qt-container qt-hero-show-wraper1")
                    $("#des-hero-name").attr("src", "img/home_hero_show/name_msk.png").attr("alt", "name_msk")
                    $("#des-hero-text").text("当你在黑暗中渴望安宁，就会坠落进更苦难的深渊。马索科告诉自己，自己所做之事都是对的，但无法减轻他分毫罪恶感的是——下一次仍会再次举起挥向同胞的利刃。")
                    $("#rw-img img").eq(rwIndex - 1).addClass("rw-img-active").siblings().removeClass("rw-img-active")
                    break;
                case "2":
                    $("#hero").removeClass().addClass("qt-container qt-hero-show-wraper2")
                    $("#des-hero-name").attr("src", "img/home_hero_show/name_lts.png").attr("alt", "name_lts")
                    $("#des-hero-text").text("美艳的女法师。因为被霍克多从十字架上解救下来，而对霍克多忠心耿耿， 担任黑化霍克多的战争代言人也毫无怀疑，甚至在霍克多的面目被拆穿后，也无条件的相信着霍克多是有苦衷的，并选择跟随他直至死亡的人物。")
                    $("#rw-img img").eq(rwIndex - 1).addClass("rw-img-active").siblings().removeClass("rw-img-active")
                    break;
                case "3":
                    $("#hero").removeClass().addClass("qt-container qt-hero-show-wraper3")
                    $("#des-hero-name").attr("src", "img/home_hero_show/name_lnz.png").attr("alt", "name_lnz")
                    $("#des-hero-text").text("不理朝政的尊贵君王，手底没有可用之人，看似是空有头衔的傀儡王雷诺兹国王实际上对北洛蒙克的势力角逐洞若观火，克鲁利崛起后，也巧妙地维持着局面的平衡，非常冷静。")
                    $("#rw-img img").eq(rwIndex - 1).addClass("rw-img-active").siblings().removeClass("rw-img-active")
                    break;
                case "4":
                    $("#hero").removeClass().addClass("qt-container qt-hero-show-wraper4")
                    $("#des-hero-name").attr("src", "img/home_hero_show/name_bfl.png").attr("alt", "name_bfl")
                    $("#des-hero-text").text("人们常常引以为傲慢的贝弗丽是来自哪个王国的公主，实际上贝弗丽只不过是一位女佣的女儿，但是她天生带着瞧不起人的语气，即使你极度恼火，想到她那惊人的魔法天赋也会拿她毫无办法。")
                    $("#rw-img img").eq(rwIndex - 1).addClass("rw-img-active").siblings().removeClass("rw-img-active")
                    break;
                case "5":
                    $("#hero").removeClass().addClass("qt-container qt-hero-show-wraper5")
                    $("#des-hero-name").attr("src", "img/home_hero_show/name_ck.png").attr("alt", "name_ck")
                    $("#des-hero-text").text("来历不明的东方僧侣，掌握着神秘的东方力量，拥有强大的战斗力，成为各方领主争相招揽的红人。因为其行踪不定，所以很少有人能够了解到他的讯息。")
                    $("#rw-img img").eq(rwIndex - 1).addClass("rw-img-active").siblings().removeClass("rw-img-active")
                    break;
                case "6":
                    $("#hero").removeClass().addClass("qt-container qt-hero-show-wraper6")
                    $("#des-hero-name").attr("src", "img/home_hero_show/name_sy.png").attr("alt", "name_sy")
                    $("#des-hero-text").text("桑娅是被父母抛弃在修道院的可怜孩子，但是多亏了修道院的修士悉心照料，桑娅并没有被自己的身世所纠缠，她相信自己的命运是圣神的安排，总是对生活充满感激，乐观的看待所面对的人世间的悲欢离合。")
                    $("#rw-img img").eq(rwIndex - 1).addClass("rw-img-active").siblings().removeClass("rw-img-active")
                    break;
                default:
                    return
            }
        })

        /* 右侧导航 */
        let totalheight = parseFloat($(window).height()) + parseFloat($(window).scrollTop()) + parseFloat($('footer').height())
        if ($(window).scrollTop() > 400 && ($(document).height()) > (totalheight)) {
            $(".right-navigation")[0].style.display = 'inline-block'
        }
        let timeOut
        $(window).scroll(function () {
            clearTimeout(timeOut)
            timeOut = setTimeout(function () {
                let totalheight = parseFloat($(window).height()) + parseFloat($(window).scrollTop()) + parseFloat($('footer').height())
                if ($(window).scrollTop() > 400 && ($(document).height()) > (totalheight)) {
                    $(".right-navigation").fadeIn(0)
                } else {
                    $(".right-navigation").fadeOut(0)
                }
            }, 100)
        })

        /* 判断当前是移动端还是pc端 */
        function browserRedirect() {
            var sUserAgent = navigator.userAgent.toLowerCase();
            var bIsIpad = sUserAgent.match(/ipad/i) == "ipad";
            var bIsIphoneOs = sUserAgent.match(/iphone os/i) == "iphone os";
            var bIsMidp = sUserAgent.match(/midp/i) == "midp";
            var bIsUc7 = sUserAgent.match(/rv:1.2.3.4/i) == "rv:1.2.3.4";
            var bIsUc = sUserAgent.match(/ucweb/i) == "ucweb";
            var bIsAndroid = sUserAgent.match(/android/i) == "android";
            var bIsCE = sUserAgent.match(/windows ce/i) == "windows ce";
            var bIsWM = sUserAgent.match(/windows mobile/i) == "windows mobile";
            
            if (!(bIsIpad || bIsIphoneOs || bIsMidp || bIsUc7 || bIsUc || bIsAndroid || bIsCE || bIsWM) ){
                // pc
                $("#mvideo").css('display','block');
                $("#mvideoImg").css('display','none');
            }else {
                // mobile
                $("#mvideo").css('display','none');
                $("#mvideoImg").css('display','block');
            }
        }
        browserRedirect();

    });

})(jQuery);


/* 切换下载二维码 */
function downloadBtn(type) {
    switch (type) {
        case 1:
            if (!$("#android-btn").hasClass("btn-select")) {
                $("#android-btn").addClass("btn-select")
                $("#wallet-btn").removeClass("btn-select")
                $("#code-img").attr("src", "./img/home/androidGameCode.png")
            }
            break;
        case 2:
            if (!$("#wallet-btn").hasClass("btn-select")) {
                $("#wallet-btn").addClass("btn-select")
                $("#android-btn").removeClass("btn-select")
                $("#code-img").attr("src", "./img/home/wallet.png")
            }
            break;
        default:
            return;
    }
}

function switchNewsTabBar(type) {
    var newslist = [
        {
            title: "《千腾纪元》最全英雄图鉴——SSS篇",
            time: "2020年7月30日",
            url: "./newsDetail.html?id=1"
        }, {
            title: "「千腾」游戏背后的故事——策划",
            time: "2020年3月26日",
            url: "./newsDetail.html?id=4"
        }, {
            title: "「千腾」游戏背后的故事——H5游戏开发",
            time: "2020年3月23日",
            url: "javascript:;"
        }, {
            title: "「千腾」骑士马索科人物小传",
            time: "2020年2月19日",
            url: "./newsDetail.html?id=5"
        }, {
            title: "「千腾」游戏背后的故事——游戏音效设计",
            time: "2020年1月17日",
            url: "./newsDetail.html?id=7"
        }, {
            title: "「千腾」游戏背后的故事——背景介绍二",
            time: "2020年1月17日",
            url: "./newsDetail.html?id=8"
        }, {
            title: "「千腾」游戏背后的故事——背景介绍",
            time: "2020年1月13日",
            url: "./newsDetail.html?id=9"
        }, {
            title: "「千腾」游戏制作背后的故事——原画",
            time: "2020年1月10日",
            url: "./newsDetail.html?id=10"
        }
    ];
    var noticeList = [
        {
            title: "《千腾纪元》不删档内测启动就在今日！",
            time: "2020年7月01日",
            url: "./newsDetail.html?id=2"
        },
        {
            title: "SGT钱包与《千腾纪元》对接在即",
            time: "2020年4月23日",
            url: "./newsDetail.html?id=3"
        },
        {
            title: "定了！《千腾纪元》！",
            time: "2020年3月17日",
            url: "./newsDetail.html?id=6"
        }
    ];
    switch (type) {
        case 1:
            $(".news-column-wraper .news-list").empty();
            var str = "";
            $.each(newslist, function (i, val) {
                str += '<li><a href="' + val.url + '">' + val.title + '<span>' + val.time + '</span></a></li>'
            });
            $(".news-column-wraper .news-list").append(str);

            if (!$("#tabBarNews").hasClass("tabBar-selected")) {
                $("#tabBarNews").addClass("tabBar-selected")
                $("#tabBarNewsNotice").removeClass("tabBar-selected")
            }
            break;
        case 2:
            $(".news-column-wraper .news-list").empty();
            var str = "";
            $.each(noticeList, function (i, val) {
                str += '<li><a href="' + val.url + '">' + val.title + '<span>' + val.time + '</span></a></li>'
            });
            $(".news-column-wraper .news-list").append(str);

            if (!$("#tabBarNewsNotice").hasClass("tabBar-selected")) {
                $("#tabBarNewsNotice").addClass("tabBar-selected")
                $("#tabBarNews").removeClass("tabBar-selected")
            }
            break;
        default:
            return
    }
}


/* 玩法介绍和原创音乐 */

let second = 0
let interval
let min = 0
let sec = 0
let whichMusic = 1
function goTop() {
    $('body,html').animate({ scrollTop: 0 }, 1000);
}
function loadMusic() {

}
function musicPlay(type) {
    
    if (type === 0) {
        $('#ztBtn')[0].style.display = 'inline'
        $('#playBtn')[0].style.display = 'none'
        // $('#audioItem')[0].play(second)
        switch(whichMusic) {
            case 1: 
                $('#audioItem-first')[0].play(second)
                break
            case 2:
                $('#audioItem-second')[0].play(second)
                break
            case 3:
                $('#audioItem-third')[0].play(second)
                break
        }
        $('.qt-music-pause').addClass('qt-music-player').removeClass('qt-music-pause')
        interval = setInterval(function () {
            second = second += 1
            ++sec
            $('.qt-music-progress')[0].value = String(second)

            if (second % 60 === 0) {
                min++
                sec = 0
            }
            let secs = sec < 10 ? '0' + sec : sec
            $('#playTime')[0].textContent = min + ':' + secs
            if (second >= Number($('.qt-music-progress')[0].max)) {
                clearInterval(interval)
                $('#playTime')[0].textContent = '0:00'
                $('.qt-music-progress')[0].value = '0'
                musicPlay(1)
                second = 1
                min = 0
                sec = 0
            }
        }, 1000)
    } else {
        $('#playBtn')[0].style.display = 'inline'
        $('#ztBtn')[0].style.display = 'none'
        $('#audioItem-first')[0].pause()
        $('#audioItem-second')[0].pause()
        $('#audioItem-third')[0].pause()
        clearInterval(interval)
        $('.qt-music-player').addClass('qt-music-pause').removeClass('qt-music-player')
    }
}
function changeSong(type) {
    second = 0
    min = 0
    sec = 0
    $('.qt-music-progress')[0].value = '0'
    $('#playTime')[0].textContent = '0:00'
    let activeDom = $('.qt-music-active')
    activeDom.removeClass('qt-music-active')
    musicPlay(1)
    if (type === 0) {
        switch (activeDom[0].id) {
            case 'song-wwwy':
                $('#song-gjzm').addClass('qt-music-active')
                whichMusic = 2
                $('.qt-music-pause')[0].src = './img/music/chenkunCD.png'
                $('.qt-music')[0].style.backgroundImage = "url('./img/music/chenkunbg.png')"
                $('#musicTime')[0].textContent = '1:13'
                $('.qt-music-progress')[0].max = 73
                break
            case 'song-hzdnz':
                $('#song-wwwy').addClass('qt-music-active')
                whichMusic = 1
                $('.qt-music-pause')[0].src = './img/music/devilCD.png'
                $('.qt-music')[0].style.backgroundImage = "url('./img/music/devil.png')"
                $('#musicTime')[0].textContent = '2:17'
                $('.qt-music-progress')[0].max = 137
                break
            case 'song-gjzm':
                $('#song-hzdnz').addClass('qt-music-active')
                whichMusic = 3
                $('.qt-music-pause')[0].src = './img/music/DragonCD.png'
                $('.qt-music')[0].style.backgroundImage = "url('./img/music/Dragon.png')"
                $('#musicTime')[0].textContent = '0:54'
                $('.qt-music-progress')[0].max = 54
                break
            default:
                $('#song-wwwy').addClass('qt-music-active')
                whichMusic = 1
                $('.qt-music-pause')[0].src = './img/music/devilCD.png'
                $('.qt-music')[0].style.backgroundImage = "url('./img/music/devil.png')"
                $('#musicTime')[0].textContent = '2:17'
                $('.qt-music-progress')[0].max = 137
        }
    } else {
        switch (activeDom[0].id) {
            case 'song-wwwy':
                $('#song-hzdnz').addClass('qt-music-active')
                whichMusic = 3
                $('.qt-music-pause')[0].src = './img/music/DragonCD.png'
                $('.qt-music')[0].style.backgroundImage = "url('./img/music/Dragon.png')"
                $('#musicTime')[0].textContent = '0:54'
                $('.qt-music-progress')[0].max = 54
                break
            case 'song-hzdnz':
                $('#song-gjzm').addClass('qt-music-active')
                whichMusic = 2
                $('.qt-music-pause')[0].src = './img/music/chenkunCD.png'
                $('.qt-music')[0].style.backgroundImage = "url('./img/music/chenkunbg.png')"
                $('#musicTime')[0].textContent = '1:13'
                $('.qt-music-progress')[0].max = 73
                break
            case 'song-gjzm':
                $('#song-wwwy').addClass('qt-music-active')
                whichMusic = 1
                $('.qt-music-pause')[0].src = './img/music/devilCD.png'
                $('.qt-music')[0].style.backgroundImage = "url('./img/music/devil.png')"
                $('#musicTime')[0].textContent = '2:17'
                $('.qt-music-progress')[0].max = 137
                break
            default:
                $('#song-wwwy').addClass('qt-music-active')
                whichMusic = 1
                $('.qt-music-pause')[0].src = './img/music/devilCD.png'
                $('.qt-music')[0].style.backgroundImage = "url('./img/music/devil.png')"
                $('#musicTime')[0].textContent = '2:17'
                $('.qt-music-progress')[0].max = 137
        }
    }
    // let index = $('audio').attr("data-index")
    // $("audio").eq(index - 1).addClass("music-active").siblings().removeClass("music-active")
    //   if(isNaN($('#audioItem')[0].duration)) {
    //     setTimeout(function () {
    //         let time = $('#audioItem')[0].duration
    //         // $('#musicTime')[0].textContent = timeTran(time)
    //         $('.qt-music-progress')[0].max = time
    //     }, 200)
    //   }
}
function inputChange() {
    second = parseInt($('.qt-music-progress')[0].value)
    min = parseInt(second / 60)
    sec = Math.round(second % 60)
    $('#playTime')[0].textContent = timeTran(second)
    switch(whichMusic) {
        case 1: 
            $('#audioItem-first')[0].currentTime = second
            break
        case 2:
            $('#audioItem-second')[0].currentTime = second
            break
        case 3:
            $('#audioItem-third')[0].currentTime = second
            break
    }
}
function timeTran(time) {
    let minute = parseInt(time / 60)
    let second = Math.round(time % 60)
    if (second < 10) {
        second = "0" + second
    }
    return minute + ':' + second
}
function navigationClick(index) {
    switch (index) {
        case 0:
            $('#newsBanner')[0].src = './img/home/sidebarnewsa.png'
            break
        case 1:
            $('#bcBanner')[0].src = './img/home/sidebar1-a.png'
            break
        case 2:
            $('#heroBanner')[0].src = './img/home/sidebar2-a.png'
            break
        case 3:
            $('#playBanner')[0].src = './img/home/sidebar3-a.png'
            break
        case 4:
            $('#musicBanner')[0].src = './img/home/sidebar4-a.png'
            break
    }
}
let contentArr = [
    {
        title: '战前布阵',
        content: '战前布阵是决定一场战斗能否取胜的关键因素之一，玩家可任意拖拽己方部队至上阵点进行排兵布阵，布阵结束后点击出击即可开始战斗。'
    },
    {
        title: '自动战斗',
        content: '为便利玩家操作及提升游戏体验，战斗进行过程中，点击自动按钮，即可将我方部队托管给电脑进行自动战斗。'
    },
    {
        title: '英雄升级',
        content: '玩家可前往商城中的资源板块购买英雄升级所需经验药，然后前往英雄详情页选择需要升级的英雄，根据所示步骤进行升级操作。'
    },
    {
        title: '装备穿戴',
        content: '玩家点击英雄按钮进入英雄详情页，在装备模块中即可实现装备一件穿戴。'
    },
    {
        title: '兵种升级',
        content: '玩家点击进入兵营，在训练模块中即可对满足条件的兵种进行升级，还可在训练队列中查看升级进度，同时也可通过花费钻石即刻进行升级。'
    },
    {
        title: '装备强化',
        content: '玩家可通过点击选择英雄详情页中的装备进行强化，也可直接从大厅进入铁匠铺进行装备强化。'
    }
]
let booleanArr = {
    isfirstItem: true,
    issecondItem: false,
    isthirdItem: false,
    isfourthItem: false,
    isfifthItem: false,
    issixthItem: false
}
let currentIndex = 0
function bannerItemClick(index) {
    currentIndex = index
    switch (index) {
        case 0:
            $('.qt-playMethod-bc')[0].style.backgroundImage = "url('./img/playMethod/01.png')"
            $('#videoPlay')[0].src = 'https://img.qiantengcn.com/video/game5.mp4'
            $('.qt-playMethod-content-title')[0].textContent = contentArr[0].title
            $('.qt-playMethod-content-main')[0].textContent = contentArr[0].content
            selectBanner('isfirstItem')
            break
        case 1:
            $('.qt-playMethod-bc')[0].style.backgroundImage = "url('./img/playMethod/02.png')"
            $('#videoPlay')[0].src = 'https://img.qiantengcn.com/video/game9.mp4'
            $('.qt-playMethod-content-title')[0].textContent = contentArr[1].title
            $('.qt-playMethod-content-main')[0].textContent = contentArr[1].content
            selectBanner('issecondItem')
            break
        case 2:
            $('.qt-playMethod-bc')[0].style.backgroundImage = "url('./img/playMethod/03.png')"
            $('#videoPlay')[0].src = 'https://img.qiantengcn.com/video/game4.mp4'
            $('.qt-playMethod-content-title')[0].textContent = contentArr[2].title
            $('.qt-playMethod-content-main')[0].textContent = contentArr[2].content
            selectBanner('isthirdItem')
            break
        case 3:
            $('.qt-playMethod-bc')[0].style.backgroundImage = "url('./img/playMethod/04.png')"
            $('#videoPlay')[0].src = 'https://img.qiantengcn.com/video/game6.mp4'
            $('.qt-playMethod-content-title')[0].textContent = contentArr[3].title
            $('.qt-playMethod-content-main')[0].textContent = contentArr[3].content
            selectBanner('isfourthItem')
            break
        case 4:
            $('.qt-playMethod-bc')[0].style.backgroundImage = "url('./img/playMethod/05.png')"
            $('#videoPlay')[0].src = 'https://img.qiantengcn.com/video/game1.mp4'
            $('.qt-playMethod-content-title')[0].textContent = contentArr[4].title
            $('.qt-playMethod-content-main')[0].textContent = contentArr[4].content
            selectBanner('isfifthItem')
            break
        case 5:
            $('.qt-playMethod-bc')[0].style.backgroundImage = "url('./img/playMethod/06.png')"
            $('#videoPlay')[0].src = 'https://img.qiantengcn.com/video/game7.mp4'
            $('.qt-playMethod-content-title')[0].textContent = contentArr[5].title
            $('.qt-playMethod-content-main')[0].textContent = contentArr[5].content
            selectBanner('issixthItem')
            break
    }
}
function selectBanner(index) {
    $.each(booleanArr, function (key, value) {
        if (key === index) {
            booleanArr[key] = true
        } else {
            booleanArr[key] = false
        }
    })
    $('#firstItem')[0].src = booleanArr['isfirstItem'] ? './img/playMethod/01-1.png' : './img/playMethod/01-2.png'
    $('#secondItem')[0].src = booleanArr['issecondItem'] ? './img/playMethod/02-1.png' : './img/playMethod/02-2.png'
    $('#thirdItem')[0].src = booleanArr['isthirdItem'] ? './img/playMethod/03-1.png' : './img/playMethod/03-2.png'
    $('#fourthItem')[0].src = booleanArr['isfourthItem'] ? './img/playMethod/04-1.png' : './img/playMethod/04-2.png'
    $('#fifthItem')[0].src = booleanArr['isfifthItem'] ? './img/playMethod/05-1.png' : './img/playMethod/05-2.png'
    $('#sixthItem')[0].src = booleanArr['issixthItem'] ? './img/playMethod/06-1.png' : './img/playMethod/06-2.png'
}
function btnClick(type) {
    if (type === 0) {
        if (currentIndex === 0) {
            currentIndex = 5
        } else {
            currentIndex -= 1
        }
        bannerItemClick(currentIndex)
    } else {
        if (currentIndex === 5) {
            currentIndex = 0
        } else {
            currentIndex += 1
        }
        bannerItemClick(currentIndex)
    }
}

function navigationClick(index) {
    let t
    switch (index) {
        case 0:
            t = $('#news').offset().top
            break
        case 1:
            t = $('#story').offset().top
            break
        case 2:
            t = $('#hero').offset().top
            break
        case 3:
            t = $('#play').offset().top
            break
        case 4:
            t = $('#music').offset().top
            break
    }
    naviChange(index)
    $("html,body").animate({ scrollTop: t }, 500)
}
function naviChange(index) {
    let itemArr = [false, false, false, false, false]
    itemArr[index] = true
    $('#newsNavi')[0].src = itemArr[0] ? './img/home/sidebarnewsa.png' : './img/home/sidebarnews.png'
    $('#storyNavi')[0].src = itemArr[1] ? './img/home/sidebar1-a.png' : './img/home/sidebar1.png'
    $('#heroNavi')[0].src = itemArr[2] ? './img/home/sidebar2-a.png' : './img/home/sidebar2.png'
    $('#playNavi')[0].src = itemArr[3] ? './img/home/sidebar3-a.png' : './img/home/sidebar3.png'
    $('#musicNavi')[0].src = itemArr[4] ? './img/home/sidebar4-a.png' : './img/home/sidebar4.png'
}